.pull-right 
  p.m0
    small.mr Single column
    label.switch.pull-right 
      input(type='checkbox', checked="checked", ng-model="timelineAlt")
      span

h3 Timeline
// START timeline
ul(ng-class="timelineAlt ? 'timeline-alt' : 'timeline'", ng-init="timelineAlt=false")
  li.timeline-separator(data-datetime="Now")
  // START timeline item
  li
    .timeline-badge.primary
      em.fa.fa-users
    .timeline-panel
      .popover(ng-class="timelineAlt ? 'right' : 'left'")
          h4.popover-title Client Meeting
          .arrow
          .popover-content
            p Av 123 St - Floor 2
              br
              small Pellentesque ut diam velit, eget porttitor risus. Nullam posuere euismod volutpat. 
  // END timeline item
  // START timeline item
  li.timeline-inverted
    .timeline-badge.warning
      em.fa.fa-phone
    .timeline-panel
      .popover.right
          h4.popover-title Call
          .arrow
          .popover-content
            p Michael 
              a(href="tel:+011654524578") (+011) 6545 24578 ext. 132
              br
              small Pellentesque ut diam velit, eget porttitor risus. Nullam posuere euismod volutpat. 
  // END timeline item
  // START timeline separator
  li.timeline-separator(data-datetime="Yesterday")
  // END timeline separator
  // START timeline item
  li
    .timeline-badge.danger
      em.fa.fa-video-camera
    .timeline-panel
      .popover(ng-class="timelineAlt ? 'right' : 'left'")
          h4.popover-title Conference
          .arrow
          .popover-content
            p Join development group
            small
              a(href='skype:echo123?call') 
                em.fa.fa-phone
                |  Call the Skype Echo
  // END timeline item
  // START timeline item
  li.timeline-inverted
    .timeline-panel
      .popover.right
          h4.popover-title Appointment
          .arrow
          .popover-content
            p Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam.
            .btn-group
              a.dropdown-toggle(href="#", data-toggle='dropdown', data-play="fadeIn") 
                em.fa.fa-paperclip
              ul.dropdown-menu.text-left
                li: a(href='#') 
                  em.fa.fa-download
                  |  Download
                li: a(href='#') 
                  em.fa.fa-share
                  |  Send to
                li.divider
                li: a(href='#') 
                  em.fa.fa-times
                  |  Delete
  // END timeline item
  // START timeline item
  li
    .timeline-badge.info
      em.fa.fa-plane
    .timeline-panel
      .popover(ng-class="timelineAlt ? 'right' : 'left'")
          h4.popover-title Fly
          .arrow
          .popover-content
            p Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
  // END timeline item
  // START timeline item
  li
    .timeline-panel
      .popover(ng-class="timelineAlt ? 'right' : 'left'")
          h4.popover-title Appointment
          .arrow
          .popover-content
            p
              | Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
  // END timeline item
  // START timeline separator
  li.timeline-separator(data-datetime="2014-05-21")
  // END timeline separator
  // START timeline item
  li.timeline-inverted
    .timeline-badge.success
      em.fa.fa-music
    .timeline-panel
      .popover.right
          h4.popover-title Relax
          .arrow
          .popover-content
            p Listen some music
  // END timeline item
  // START timeline item
  li.timeline-end
    a(href="#").timeline-badge
      em.fa.fa-plus
  // END timeline item
// END timeline
